body {
	margin:0;
	padding:20px;
	
	background-color:#eee;
	color: #000;
	font: 10px Verdana;
	text-align:center;
}
a, a:visited {
	color:#fff000;
	text-decoration:none;
	font-weight:bolder;
	outline:none;
}
a:hover {
	text-decoration:underline;
}
h1 {
	padding:5px 0;
	margin:0;
	font-size:18px;
}
h1.game-title {
	background:url("../img/yamb-32.png") no-repeat 0 0;
	padding:5px 0 5px 40px;
	margin-top:10px
}
.toolbar {
	background:#ccc;
	padding-bottom:10px;
	height:16px;
}
.toolbar a {
	background-image: url("../img/gui/toolbar-icons.gif");
	background-repeat:no-repeat;
	background-position:16px 16px;
	color:#555;
	display:block;
	float:left;
	height:16px;
	margin:0 2px;
	overflow:hidden;
	text-indent:-100em;
	width:16px;
}
.toolbar a.new-game-singleplayer{background-position:0 0}
.toolbar a.new-game-multiplayer{background-position:0 -16px}
.toolbar a.help{background-position:0 -32px; float:right}
.toolbar a.user-login{background-position:0 -48px; float:right;}
.toolbar a.user-logout{background-position:0 -64px; float:right;}
.toolbar a:hover{
	text-decoration:none;
	color:#000;
}
.toolbar > a:first-child {
	border-right:none;
	margin-right:0;
	padding-right:0;
}
.menu {
	position:relative;
	float:right;
	color:#fff000;
	font-weight:bolder;
}
.menu > a {
	border-right:1px solid #fff;
	margin-right:4px;
	padding-right:4px;
}
.submenu {
	width:90px;
	padding:5px;
	position:absolute;
	margin:0 0 0 -5px;
	z-index:200;
	background:#00BCFF;
	display:none;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}
.submenu a {
	display:block;
	padding:2px 4px;
	color:#fff;
	border:none;
	margin:0;
}
.submenu a:hover {
	color:#3B5998;
	text-decoration:none;
	background:#fff000;
}
.loading {
	padding:5px 5px 5px 28px;
	background:#3b5999 url(../img/gui/throbber.gif) no-repeat 5px center;
	color:#fff;
	float:left;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	border-radius:10px;
}

.popup {
	position:absolute;
	background:#fff;
	padding:5px;
	z-index:14;
	color:#555;
	width:300px;
	left:525px;
	top:30px;
	display:none;
	border:10px solid rgba(127,127,127,.5);
	border-left:none;
	border-radius:0 10px 10px 0;
	text-align:left;
}
.popup a {
	color:#369;
}
.popup form{
	float:left;
	margin:0;
}
	.popup input{
		font:10px Arial;
		padding:2px;
		float:left;
		margin:5px;
		width:180px;
	}
	.popup input.submit {width:auto}
	.popup .message {
		margin:7px 0 0 0; 
		font-weight:bolder;
		display:none;
		float:right;
		width:130px;
		text-align:center;
	}
	.popup .message.ok {color:darkgreen;}
	.popup .message.error {color:red;}
	.popup fieldset {
		float:left;
		border:1px solid #ccc;
		margin:5px;
		padding:5px;
	}
	.popup legend {
		color:#aaa;
	}
	.popup label {
		clear:both;
		float:left;
		margin:5px 0;
		padding-top:3px;
		cursor:pointer;
		width:87px;
		text-align:right;
	}
	.popup input.submit {
		clear:both;
		float:right;
	}

#player-list {
	
}
	#player-list h1 {
		float:left;
		margin:0 10px;
	}
	#player-list .content{
		max-height:200px;
		overflow:auto;
		clear:both;
	}
	#player-list .content.loading{width:20px;height:20px;padding:0;background:url(../img/gui/throbber-grey.gif) no-repeat center center;text-indent:-100em;overflow:hidden;margin:10px 0 10px 45%}
	#player-list a {
		color:#369;
	}
	#player-list ul {
		list-style-type:none;
		margin:0;
		padding:0;
	}
	#player-list li {
		float:left;
		margin:5px;
		width:17%;
	}
	#player-list input.filter {
		font-size:11px;
		margin-right:5px;
	}
	
	
.yamb-help {
	
}

.yamb-help-close {
	color:#000;
	display:block;
	width:20px;
	height:20px;
	overflow:hidden;
	text-indent: -100em;
	background:url("../img/gui/close.gif") no-repeat center center;
	cursor:pointer;
	float:right;
}
.yamb-countdown {
	float:right;
	margin:10px 15px 10px 5px;
	clear: right;
}
.yamb-countdown-label {
	float:right;
	margin:10px 0;
}
.yamb-container {
	width:600px;
	background:#3B5998;
	border:10px solid #ccc;
	color:#fff;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	border-radius:10px;
	position:relative;
	float:left;

	text-align:left;
	overflow:hidden;
	cursor: default;
}
.yamb-container.oponent-container {
	opacity: 0.5;
	-moz-opacity: 0.5;
	filter:alpha(opacity=50);
}
.yamb-container.oponent-container .toolbar{visibility:hidden}

input.throw-button {
	float:right;
	margin:10px 10px 0 0;
}
.display {
	float:right;
	clear:right;
	font-weight:bolder;
	font-size:1.5em;
	margin:10px 10px 0 0;
}
.right {
	float:right;
}
.left {
	flaot:left;
}
.clear {
	clear: both;
}
.disable-mask {
	background:#EFFFEF;
	position:absolute;
	width:100%;
	height:100%;
	opacity:0.5;
	display:none;
	z-index:1;
	margin:-55px 0 0 -10px;
}
.yamb-table {
	margin: 0 10px;
	float:left;
}
.result {
	background:#369;
	color:#fff;
	font-weight:bolder;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	border-radius:10px;
	padding:10px;
	float:right;
	clear:right;
	width:100px;
	text-align:center;
	display:none;
	position:absolute;
	z-index:2;
	left:250px;
	margin-top:200px;
}
.result h1 {
	border:none;
	margin:10px 0;
	padding:0;
}
.result a {
}
.controls {
	position:absolute;
	display:none;
}
.controls .undo {
	margin:10px 0;
	display:block;
	float:left;
	clear:both;
}

ul.dices {
	list-style-type:none;
	margin:0;
	padding:0;
	float:left;
}
ul.dices li {
	float:left;
	margin:0 1px;
	padding:0;
	width:30px;
	height:30px;
	overflow:hidden;
	background-image: url(../img/gui/dice-dark.png);
	background-repeat:no-repeat;
	background-position: -100em 0;
	border:2px outset #fff;
	background-color:#fff;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	border-radius:10px;
	cursor:pointer;
}
ul.dices li[locked="1"] {
	background-color:#00bcff;
	border-color:#00bcff;
}

ul.dices li.value1 {background-position:0 0}
ul.dices li.value2 {background-position:-30px 0}
ul.dices li.value3 {background-position:-60px 0}
ul.dices li.value4 {background-position:-90px 0}
ul.dices li.value5 {background-position:-120px 0}
ul.dices li.value6 {background-position:-150px 0}

table.yamb {
	float:left;
	cursor:default;
	color:#555;
}

table.yamb td {
	width:20px;
	height:26px;
	padding:2px;
	overflow:hidden;
	text-align:center;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	border-radius:4px;
}

table.yamb tr td.field.called {
	background:#ffee40 !important;
	border-color:transparent !important;
	opacity:1 !important;
	cursor:pointer;
}

table.yamb tr td.empty,
table.yamb tr.sum td,
table.yamb tr.head td {
	text-align:center;
	font-weight:bolder;
	border:1px solid transparent;
	color:#A7BADF;
}
table.yamb tr td.label {
	text-align:center;
	color:#A7BADF;
	border-color:transparent;
	text-transform: uppercase;
}
table.yamb tr.head td {	background-color:#A7BADF;}
table.yamb tr.head td.empty {background-color:transparent;}

table.yamb tr td.field {
	background:#fff;
	opacity:0.05;
	border:1px solid transparent;
}
table.yamb tr td.field.played {
	opacity:1;
	background:#fff;
}
table.yamb tr td.field.toplay {
	cursor:pointer; 
	opacity:1;
	background:transparent;
	border:1px solid #00bcff;
}
table.yamb tr td.field.over-value {color:#00BCFF;}
table.yamb tr td.called.over-value {color:#3B5998;}
table.yamb tr td.field[value] {cursor:default;}

table.yamb tr.sum td {
	background:#A7BADF;
	color:#3B5998 ;
}
table.yamb tr.sum td.label {
	color:transparent;
	background:transparent;
}
table.yamb tr.sum td.total {
	width:70px;
	background:#00bcff;
	color:#3B5998;
}
table.yamb tr.sum td.empty {
	background-color:transparent;
}
table.yamb tr.sum td.total.yamb-total {
	background:transparent;
	color:#fff;
	font-size:17px;
}

#yamb-end-mask {
	background:#000;
	position:absolute;
	top:0;
	left:0;
	width:100%;
	z-index:100;
}
#yamb-end-container {
	background:#fff;
	color:#555;
	padding:10px;
	position:absolute;
	z-index:101;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	text-align: center;
	border:5px solid #ccc;
}
#yamb-end-container a {
	color:#00BCFF;
}
#yamb-end-container h2 {
	margin:0 0 15px 0;
	padding:0;
	text-align:center;
	color:#3B5998;
	font-size:20px;
}
#yamb-end-container .end-result {
	font-size:20px;
	line-height:12px;
	color:#3B5998;
}